<%@ taglib prefix="s" uri="/struts-tags"%>
<%@ taglib prefix="sj" uri="/struts-jquery-tags"%>
<%@ taglib prefix="sjg" uri="/struts-jquery-grid-tags"%>
<%@ taglib prefix="tiles" uri="http://tiles.apache.org/tags-tiles"%>
<head>
<script type="text/javascript">
	$.subscribe('chargerReglements', function(event, data) {

				 var grid = event.originalEvent.grid;
				 var ligneId = grid.jqGrid('getGridParam', 'selrow');
				 var reglementId = grid.jqGrid('getCell', ligneId, 'id');

				 var form = document.getElementById('afficherDetailReglement');

				 if (form.idReglementSelectionne.value != reglementId) {
					 form.idReglementSelectionne.value = reglementId;
					 form.submit();
				 }
		;

	});
</script>
</head>
<s:div id="tableauReglements">
	<s:fielderror />
	<s:actionmessage />
	<s:actionerror />
	<s:url var="remplirListeReglementsAction" action="remplirReglementsFacture" />
	<s:text var="titreTableauReglements" name="facture.reglements.titreTableau" />
	<sjg:grid gridModel="listeTableau" caption="%{titreTableauReglements}" dataType="json"
		href="%{remplirListeReglementsAction}" pager="true" pagerInput="false" rownumbers="true" rowList="10,20,30"
		rowNum="10" viewrecords="true" autowidth="true" hidegrid="true" onSelectRowTopics="chargerReglements">
		<s:text var="titreReglementId" name="id" />
		<sjg:gridColumn name="id" key="true" index="id" title="%{titreReglementId}" hidden="true" sortable="false" />
		<s:text var="titreLibellePayeur" name="reglementFactureTableau.libellePayeur.titre" />
		<sjg:gridColumn name="libellePayeur" index="libellePayeur" title="%{titreLibellePayeur}" sortable="false" />
		<s:text var="titreDatePayement" name="reglementFactureTableau.datePayement.titre" />
		<sjg:gridColumn name="datePayement" index="datePayement" title="%{titreDatePayement}" sortable="false" />
		<s:text var="titreMontant" name="reglementFactureTableau.montant.titre" />
		<sjg:gridColumn name="montant" index="montant" title="%{titreMontant}" sortable="false" formatter="currency" />
		<s:text var="titreMembresConcernes" name="reglementFactureTableau.membresConcernes.titre" />
		<sjg:gridColumn name="membresConcernes" index="membresConcernes" title="%{titreMembresConcernes}" sortable="false" />
	</sjg:grid>
</s:div>
<s:div id="ajouterReglementDiv" cssStyle="margin-top:20px;">
	<s:text var="titreAjouterReglement" name="facture.reglements.ajouterReglement.titrePanel" />
	<sj:accordion heightStyle="content" animate="true" collapsible="true" active="false">
		<sj:accordionItem title="%{titreAjouterReglement}">
			<table>
				<tr>
					<td><s:form id="formAjouterReglement" action="ajouterReglementFacture" validate="true">
							<s:number var="idFacture" name="idGestionGeree" />
							<s:hidden name="reglementFactureAjout.factureId" value="%{idFacture}" />
							<s:text var="defautLibelleCombo" name="commun.comboBox.defaultLibelle" />
							<s:text var="payeurLibelleCombo" name="idPayeur" />
							<s:select label="%{payeurLibelleCombo}" headerKey="-1" cssStyle="width:100%;" headerValue="%{defautLibelleCombo}"
								list="mapPayeur" name="reglementFactureAjout.idPayeur" />
							<s:text var="montantLibelle" name="montant" />
							<s:textfield label="%{montantLibelle}" name="reglementFactureAjout.montant" type="double" />
							<s:text var="dateReglementLibelle" name="dateReglement" />
							<sj:datepicker label="%{dateReglementLibelle} " name="reglementFactureAjout.dateReglement" displayFormat="dd/mm/yy" />
							<s:text var="membresConcernesLibelle" name="membresSelectionnes" />
							<s:checkboxlist list="mapMembresConcernes" label="%{membresConcernesLibelle}"
								name="reglementFactureAjout.membresSelectionnes" value="reglementFactureAjout.listMembresSelectionnes" />
						</s:form></td>
					<td align="center" valign="middle" width="250px">
						<sj:a formIds="formAjouterReglement" button="true" buttonIcon="ui-icon-plusthick">
							<s:text name="commun.bouton.ajouter.titre" />
						</sj:a>
					</td>
				</tr>
			</table>
		</sj:accordionItem>
	</sj:accordion>
</s:div>
<s:div id="afficherDetailReglementDiv" cssStyle="margin-top:20px;">
	<s:form action="afficherDetailReglement">
		<s:hidden name="idReglementSelectionne" />
		<s:text var="idReglement" name="idReglementSelectionne" />
	</s:form>
	<s:if test="idReglementSelectionne != null">
		<s:form id="supprimerReglement" action="supprimerReglement">
			<s:hidden name="idReglementSelectionne" />
		</s:form>
		<s:text var="titreDetailReglement" name="facture.reglements.detailReglementFacture.titrePanel" />
		<sj:accordion heightStyle="content" animate="true" collapsible="true">
			<sj:accordionItem title="%{titreDetailReglement}">
				<table>
					<tr>
						<td>
							<s:form id="formModifierReglement" action="modifierReglement" validate="true">
								<s:hidden name="idReglementSelectionne" />
								<s:select label="%{payeurLibelleCombo}" headerKey="-1" cssStyle="width:100%;" headerValue="%{defautLibelleCombo}"
									list="mapPayeur" name="reglementFactureModif.idPayeur" />
								<s:textfield label="%{montantLibelle}" name="reglementFactureModif.montant" type="double" />
								<sj:datepicker label="%{dateReglementLibelle} " name="reglementFactureModif.dateReglement" displayFormat="dd/mm/yy" />
								<s:checkboxlist list="mapMembresConcernes" label="%{membresConcernesLibelle}"
									name="reglementFactureModif.membresSelectionnes" value="reglementFactureModif.listMembresSelectionnes" />
							</s:form>
						</td>
						<td align="center" valign="middle" style="min-width: 150px;">
							<sj:a formIds="formModifierReglement"
								button="true" buttonIcon="ui-icon-pencil" cssStyle="width:94%;">
								<s:text name="commun.bouton.modifier.titre" />
							</sj:a>
							<sj:a formIds="supprimerReglement"
								button="true" buttonIcon="ui-icon-closethick" cssStyle="margin-top:15px;width:94%;">
								<s:text name="commun.bouton.supprimer.titre" />
							</sj:a>
						</td>
					</tr>
				</table>
			</sj:accordionItem>
		</sj:accordion>
	</s:if>
</s:div>